<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cherry.js</title>
    <script src="../../Cherry.js"></script>
</head>

<body>
    <div id="app"></div>
</body>
<script>
    new CherryMain({
        app:"app",
        child:[
            new CHE_Container({
                child: [
                    new CHE_Text({
                        name:"text",
                        height:200,
                        width:300,
                        textAlign:"center",
                        lineAlign:"center",
                        text:"HelloWorld",
                        ellipsis:true,
                        colorStyle:{
                            color:"#48bbfa",
                            size:16,   //字体大小
                            bold:false, //是否加粗
                            italic:false, //是否斜边
                            disabled:false, //是否删除
                        },
                        child: [
                          
                        ]
                    })
                ]
            }),
            new CHE_Button({
                text:"修改文字",
                margin:5,
                methods:{
                    click:()=>{
                        $GET("#text").setText("修改后的文字修改后的文字修改后的文字修改后的文字修改后的文字");
                    }
                }
            }),
            new CHE_Button({
                text:"获取文字",
                margin:5,
                methods:{
                    click:()=>{
                        console.log($GET("#text").getText());
                    }
                }
            }),
            new CHE_Button({
                text:"设置横向排列 left center right",
                margin:5,
                cookie:0,
                methods:{
                    click:(e,self)=>{
                        let all = ["left","center","right"]
                        $GET("#text").setTextalign(all[self.getCookie()])
                        self.setCookie(self.getCookie()+1);
                        if(self.getCookie() > 2){
                            self.setCookie(0);
                        }
                    }
                }
            }),
            new CHE_Button({
                text:"设置竖向排列 top center bottom",
                margin:5,
                cookie:0,
                methods:{
                    click:(e,self)=>{
                        let all = ["top","center","bottom"]
                        $GET("#text").setLinealign(all[self.getCookie()])
                        self.setCookie(self.getCookie()+1);
                        if(self.getCookie() > 2){
                            self.setCookie(0);
                        }
                    }
                }
            }),
            new CHE_Button({
                text:"设置文字样式 填入字典 参考参数colorStyle",
                margin:5,
                cookie:0,
                methods:{
                    click:(e,self)=>{
                        $GET("#text").setColorstyle({
                            color:"#80000b",
                            size:24,   //字体大小
                            bold:true, //是否加粗
                            italic:true, //是否斜边
                            disabled:true, //是否删除
                        })
                    }
                }
            }),
            new CHE_Button({
                text:"设置是否超出省略号",
                margin:5,
                cookie:true,
                methods:{
                    click:(e,self)=>{
                        $GET("#text").setEllipsis(self.getCookie());
                        self.setCookie(!self.getCookie());
                    }
                }
            }),


        ],
        Created:()=>{

        }
    });



</script>
</html>